* {
  margin: 0;
  padding: 0;
  list-style: none;
  user-select: none;
  box-sizing: border-box;
}

a {
  color: inherit;
  text-decoration: none;
}

.warp {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.loop {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.home {
  width: 18.75rem;
}

s {
  width: 100%;
  height: .2rem;
  display: block;
  background: #f8f8f8;
}

.header .warp {
  border-bottom: 1px solid #d8d8d8;
}

.header .warp h1 {
  font-size: 0.85rem;
  font-weight: normal;
  color: #333333;
}

.header .warp i {
  display: block;
  width: 2rem;
  height: 2.2rem;
  background: center no-repeat;
}

.header .warp .back {
  background-image: url("http://touch.m.dangdang.com/coreimages/back.png");
  background-size: .45rem;
}

.header .warp .menu {
  background-image: url("http://touch.m.dangdang.com/coreimages/menu.png");
  background-size: 1.15rem;
  transition: all .3s ease;
}

.header .mark {
  display: none;
  height: 2.5rem;
  transition: all .3s ease;
}

.header .mark li {
  width: 20%;
  padding: .3rem 0 .2rem;
  line-height: .8rem;
  float: left;
  text-align: center;
  background: #eee;
}

.header .mark li img {
  width: 2rem;
  height: 2rem;
}

.header .mark li p {
  color: #4d525d;
  font-size: .6rem;
}

.tabbar {
  position: fixed;
  bottom: 0;
  z-index: 99;
}

.tabbar a {
  width: 20%;
  height: 2.45rem;
  float: left;
}

.tabbar a img {
  width: 100%;
  height: 100%;
}

.navbar .search {
  width: 17.5rem;
  height: 1.5rem;
  margin: .5rem .625rem;
  background: #f5f5f5;
  border-radius: 1rem;
  font-size: .6rem;
}

.navbar .search span {
  background: url(http://touch.m.dangdang.com/images/topics/arrow_down.png) no-repeat 100%;
  background-size: .3rem .2rem;
  padding-right: .5rem;
  line-height: 1.5rem;
  margin: 0 .5rem;
}

.navbar .search input {
  width: 70%;
  padding: .25rem 0;
  font-size: .6rem;
  border: none;
  color: #4d5159;
  background-color: transparent;
}

.navbar .swiper-slide img {
  width: 100%;
  height: 7.8785rem;
}

.navbar em img {
  width: 20%;
  height: 3.55rem;
}

.navbar s {
  height: .5rem;
}

.topbar {
  font-size: .65rem;
  padding: .5rem .5rem 0;
  text-align: center;
}

.topbar div b {
  width: .9rem;
  height: .9rem;
  color: #fff;
  background: #323232;
  border-radius: .1rem;
}

.topbar div span {
  float: right;
  color: #969696;
}

.topbar div span i {
  display: inline-block;
  width: .25rem;
  height: .45rem;
  padding: 0 .3rem;
  background: url(http://img60.ddimg.cn/upload_img/00782/h5/right_arrow2-1557113277.png) 50%;
  background-size: .25rem .45rem;
  background-repeat: no-repeat;
}

.topbar div div {
  position: relative;
  width: 99%;
  height: .75rem;
  line-height: .75rem;
  margin: .6rem 0;
  font-size: .6rem;
  border-right: .05rem solid #e8e8e8;
  color: #000;
}

.topbar div div span {
  position: absolute;
  top: -0.4rem;
  right: .1rem;
  display: block;
  width: 1.1rem;
  height: .8rem;
  background-image: url(http://img61.ddimg.cn/upload_img/00775/h5/hot_icon-1556613430.png);
  background-size: 100% 100%;
  background-position: 50%;
  background-repeat: no-repeat;
}

.topbar ul {
  overflow-x: scroll;
  margin: .7rem .25rem 0;
}

.topbar ul li {
  width: 5.3215rem;
  margin-right: .25rem;
  font-size: .6rem;
}

.topbar ul li .loop {
  font-size: .65rem;
}

.topbar ul li .price {
  color: #fe435d;
  display: block;
}

.topbar ul li .original_price {
  color: #aaa;
  display: block;
}

.picbar > img {
  width: 100%;
  height: 2.6rem;
}

.picbar .swiper-slide img {
  width: 100%;
  height: 5.5rem;
}

.picbar ul {
  overflow-x: scroll;
  margin: .7rem .25rem 0;
}

.picbar ul li {
  width: 5.3215rem;
  margin-right: .25rem;
  font-size: .6rem;
}

.picbar ul li .loop {
  font-size: .65rem;
}

.picbar ul li .price {
  color: #fe435d;
}

.picbar ul li .tag {
  background: #f2303c;
  color: #fff;
  font-size: .4rem;
  line-height: .5rem;
  margin-top: .05rem;
  padding: 0 .05rem;
  border-radius: .05rem;
}
